import * as PIXI from "pixi.js";
import { App } from "../system/App";

export class Background {
  constructor() {
    this.speed = App.config.bgSpeed;
    this.container = new PIXI.Container();
    this.createSprites();
  }

  createSprites() {
    this.sprites = [];

    for (let i = 0; i < 3; i++) {
      this.createSprite(i);
    }
  }

  createSprite(i) {
    const sprite = App.sprite("bg");
    // sprite.x = -window.innerWidth;
    sprite.x = 0;
    sprite.y = 0;
    sprite.width = window.innerWidth * 2;
    sprite.height = window.innerHeight - 100;
    this.container.addChild(sprite);
    this.sprites.push(sprite);
  }

  move(sprite, offset) {


    // const spriteRightX = sprite.x + sprite.width;

    // const screenLeftX = 0;

    // if (spriteRightX <= screenLeftX) {
    //   sprite.x += sprite.width * this.sprites.length;
    // }

    // console.log('sprite.x', sprite.x, 'offset', offset)

    if (offset > 0) {
      if (sprite.x < 0 - offset) sprite.x += offset;
    } else {
      if (sprite.x > -window.innerWidth - offset) sprite.x += offset;
    }


    // sprite.x -= offset;
  }

  update(dt) {
    const offset = this.speed * dt;

    this.sprites.forEach(sprite => {
      this.move(sprite, offset);
    });
  }

  destroy() {
    this.container.destroy();
  }
}